<template>
	<view>
		<base-panel-title :isRadius="true" :title="$t('myOrder')" :fill="true">
			<view style="padding: 10px;font-size: 12px;">
				<u-grid @click="clickGrid" :border="false" col="5">
					<u-grid-item v-for="(baseListItem,baseListIndex) in baseList" :key="baseListIndex">
						<iconfont color="#4c77ee" :icon="baseListItem.name" :size="32" />
						<!-- 			<u-icon :customStyle="{paddingTop:20+'rpx'}" :name="baseListItem.name" :size="22"></u-icon> -->
						<text class="grid-text">{{baseListItem.title}}</text>
					</u-grid-item>
				</u-grid>
			</view>
		</base-panel-title>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				baseList: [{
						name: 'icon-qianbao',
						title: this.$t('toBePaid'),
					},
					{
						name: 'icon-chazhao',
						title: this.$t('toBeReviewed'),
					},
					{
						name: 'icon-tuisong',
						title: this.$t('toBeShipped'),
					},
					{
						name: 'icon-shangcheng',
						title: this.$t('goodsToBeReceived'),
					},
					{
						name: 'icon-xianzhi',
						title: this.$t('refundAfterSales'),
					}
				]
			}
		}
	}
</script>

<style>
</style>
